import React from "react";

class Weather extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      isHot: true
    }
    this.changeWeather = this.changeWeather.bind(this)
  }
  render() {
    // 当 Weather 被实例化之后会调用render方法，所以render的this指向是被new出来的实例
    const {isHot} = this.state
    return (
      <h2 onClick={this.changeWeather}>今天天气很{`${isHot ? '炎热' : '凉爽'}`}</h2>
    )
  }
  changeWeather() {
    // changeWeather 在哪？-- 在Weather的原型上，供实例调用
    // 由于 changeWeather 作为 onClick 的回调，所以不是通过实例调用的，是直接调用
    // 类中的方法默认开启局部的严格模式，所以 changeWeather 的this为 undefined
    const {isHot} = this.state
    this.setState({
      isHot: !isHot
    })
  }
}

export default Weather
